<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>订单详情</title>
    <#assign base=request.contextPath/>
    <#setting  number_format="0.##"/>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="${base}/backstage/layui/css/layui.css" media="all">
    <link href="${base}/sweep/css/mui.css" rel="stylesheet"/>
    <link href="${base}/sweep/css/app.css" rel="stylesheet"/>
    <script src="${base}/backstage/layui/layui.js?t=1"></script>
    <script src="${base}/backstage/js/jquery-1.8.3.min.js?t=1"></script>
    <script src="${base}/backstage/js/feng.js?t=1"></script>
    <script src="${base}/backstage/js/loading.js?t=1"></script>
    <script src="${base}/sweep/js/mui.min.js"></script>
    <style>
        .title {
            margin: 20px 15px 10px;
            color: #6d6d72;
            font-size: 15px;
        }
        .mui-content-padded{
            margin: 10px;
        }

    </style>

</head>
<body>
<input type="hidden" value="${listValue}" id="listVlaue"/>
<div class="mui-content" style="margin-bottom: 90px">
<#--    <ul class="mui-table-view">-->
<#--        <#list commodity as commodity>-->
<#--            <li class="mui-table-view-cell mui-media">-->
<#--                <a href="javascript:;">-->
<#--                    <img class="mui-media-object mui-pull-left" src="${commodity.commodityUrl}">-->
<#--                    <div class="mui-media-body">-->
<#--                        ${commodity.commodityName}<span style="float: right;color: red">￥${commodity.price}</span>-->
<#--                        <p class='mui-ellipsis'>${commodity.commodityDescribe}</p>-->
<#--                    </div>-->
<#--                </a>-->
<#--            </li>-->
<#--        </#list>-->
<#--    </ul>-->
    <ul id="OA_task_1" class="mui-table-view">
        <#list commodity as commodity>
        <li class="mui-table-view-cell">
            <div class="mui-slider-right mui-disabled">
                <a class="mui-btn mui-btn-red" onclick="deleteSubscript('${commodity.id}')">删除</a>
            </div>
                <div class="mui-slider-handle">
                    <img class="mui-media-object mui-pull-left" src="${commodity.commodityUrl}">
                    <div class="mui-media-body">
                        ${commodity.commodityName}<span style="float: right;color: red">￥${commodity.price}</span>
                        <p class='mui-ellipsis'>${commodity.commodityDescribe}</p>
                    </div>
                </div>
        </li>
        </#list>

    </ul>
</div>

<div class="mui-content" style="position: fixed;bottom: 0px;width: 100%;background: none">
    <div class="mui-content-padded">
        <button type="button" class="mui-btn mui-btn-warning mui-btn-block">提  交</button>
    </div>
</div>
</body>
<script>
    mui.init();
    function deleteSubscript(id) {
        // alert(subscript)
        var listValue =  $("#listValue").val();
        var b = id+",";
        var a = listValue.split(b);
        alert(a)

    }
    // (function($) {
    //     //第一个demo，拖拽后显示操作图标，点击操作图标删除元素；
    //     $('#OA_task_1').on('tap', '.mui-btn', function(event) {
    //         var elem = this;
    //         var li = elem.parentNode.parentNode;
    //         mui.confirm('确认删除该条记录？', '亲爱的用户,您好!', btnArray, function(e) {
    //             if (e.index == 0) {
    //                 li.parentNode.removeChild(li);
    //                 // alert(1)
    //
    //
    //             } else {
    //                 setTimeout(function() {
    //                     $.swipeoutClose(li);
    //                 }, 0);
    //             }
    //         });
    //     });
    //     var btnArray = ['确认', '取消'];
    //
    // })(mui);
</script>
</html>